<template>
  <div>
    <el-form ref="formRef" label-width="120px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="用户id:" prop="id">
            <el-input
              v-model="detailFormData.id"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="创建人:" prop="createUser">
            <el-input
              v-model="detailFormData.createUser"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="直播名字:" prop="name">
            <el-input
              v-model="detailFormData.name"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="type" label="分类:" disabled>
            <el-input
              v-model="detailFormData.type"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="status" label="状态:" disabled>
            <el-input v-model="detailFormData.status" placeholder="" disabled>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="watchNumber" label="观看人数:" disabled>
            <el-input
              v-model="detailFormData.watchNumber"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="创建时间:" prop="updateTime">
            <el-input
              v-model="detailFormData.updateTime"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="预计时长:" prop="projectedTime">
            <el-input
              v-model="detailFormData.projectedTime"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="实际时长:" prop="time">
            <el-input
              v-model="detailFormData.time"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="结束时间:" prop="endTime">
            <el-input
              v-model="detailFormData.endTime"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="直播回放:" prop="liveReplay">
            <el-input
              v-model="detailFormData.liveReplay"
              placeholder=""
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- 按钮 -->
      <el-form-item>
        <el-row type="flex" justify="center">
          <el-col :span="16">
            <el-button size="mini" type="primary" @click="btnOk"
              >返回上一页</el-button
            >
          </el-col>
        </el-row>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { livePersonnelDatalisApi } from "@/api/liveBroadcast";
export default {
  data() {
    return {
      detailFormData: {
        name: "",
        createTime: "",
        createUser: "",
        endTime: "",
        id: "",
        liveReplay: "",
        projectedTime: "",
        status: "",
        time: "",
        type: "",
        updateTime: "",
        watchNumber: "",
      },
    };
  },
  created() {
    if (this.$route.params.id) {
      this.liveStreamingDetails();
    }
    console.log(this.$route.params.id);
  },
  methods: {
    btnOk() {
      this.$router.push("/dashboard");
    },
    async liveStreamingDetails() {
      const res = await livePersonnelDatalisApi(this.$route.params.id);
      console.log(res);
      this.detailFormData = res.data;
    },
  },
};
</script>

<style scoped></style>
